@extends('admin.layouts.content')
@section('content')
    <form class="layui-form layui-form-pane" id="add-form" lay-filter="add-form">
        <input type="hidden" value="{{ @$model->id }}" name="id">
        <input type="hidden" value="{{ @$model->url }}" name="url">
        <div class="layui-form-item" style="margin-top: 5px;">

            <div class="layui-inline">
                <label class="layui-form-label">发送类别</label>
                <div class="layui-input-inline">
                    <select name="category" lay-filter="category" required lay-verify="required">
                        <option value='1'>图文</option>
                        <option value='2'>文字</option>
                    </select>
                </div>
                {{--                <div class="layui-form-mid layui-word-aux">【领取后，优惠券可使用的时间区间】</div>--}}
            </div>
            <div class="layui-form-item">
            </div>

            <label class="layui-form-label">标题</label>
            <div class="layui-input-inline">
                <input type="text" name="title" required lay-verify="required" placeholder="标题"
                       autocomplete="off" class="layui-input" value="{{ @$model->title }}">
            </div>
        </div>




        <div class="layui-form-item">
            <div class="layui-form-item">
                <label class="layui-form-label">描述</label>
                <div class="layui-input-block">
                    <textarea cols="25" rows="5" placeholder="请输入描述" lay-verify="required"  name="description">{{ @$model->description }}</textarea>
                </div>
            </div>
        </div>


{{--        <div class="layui-form-item" style="margin-top: 5px;">--}}
{{--            <label class="layui-form-label">跳转地址</label>--}}
{{--            <div class="layui-input-inline">--}}
{{--                <input type="text" name="url" required lay-verify="required" placeholder="跳转地址"--}}
{{--                       autocomplete="off" class="layui-input" value="{{ @$model->url }}">--}}
{{--            </div>--}}
{{--        </div>--}}

        <div class="layui-row layui-col-space10" id="imgss">
            <div class="layui-col-lg8">
                <label class="layui-form-label">图片</label>
                <div class="layui-input-block">
                    <input type="hidden" name="big_image" id="form_image" value="{{ @$model ? $model->picurl : '' }}" placeholder="" autocomplete="off" class="layui-input">
                    <button type="button" class="layui-btn upload" id="image">
                        <i class="layui-icon">&#xe67c;</i>上传图片
                    </button>
                </div>

                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top:10px;">
                    <div class="layui-upload-list" id="div-slide_show">
                        <img src="{{ @$model ? $model->picurl : '' }}" alt="" height="100px" class="img-image">
                    </div>
                </blockquote>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">推送类型</label>
                <div class="layui-input-inline">
                    <select name="type" lay-filter="type" lay-verify="required">
                        <option value="">请选择</option>
                        <option value="at_current">立即发送</option>
                        <option value="at_date">定时发送</option>
                        <option value="every_day">每天发送</option>
                        <option value="every_week">每周发送</option>
                        <option value="every_month">每月发送</option>
                    </select>
                </div>
{{--                <div class="layui-form-mid layui-word-aux">【领取后，优惠券可使用的时间区间】</div>--}}
            </div>
        </div>

        <div class="layui-form-item" id="is_time_hidden" >
            <label class="layui-form-label">推送时间</label>
            <div class="layui-input-inline">
                <input type="text" name="times" id="time"
                        placeholder="请选择推送时间"
                       autocomplete="off" class="layui-input" >
            </div>
{{--            <div class="layui-form-mid layui-word-aux">【可领取区间】</div>--}}
        </div>

        <div class="layui-form-item" id="weeks">
            <div class="layui-inline">
                <label class="layui-form-label">每周几</label>
                <div class="layui-input-inline">
                    <select name="week" lay-filter="week" id="week_info">
                        <option value="">请选择</option>
                        <option value="1">周一</option>
                        <option value="2">周二</option>
                        <option value="3">周三</option>
                        <option value="4">周四</option>
                        <option value="5">周五</option>
                        <option value="6">周六</option>
                        <option value="7">周日</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">推送时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="week_time" id="week_times"
                           placeholder="推送时间"
                           autocomplete="off" class="layui-input">
                </div>

            </div>

        </div>


        <div class="layui-form-item" id="months">
            <div class="layui-inline">
                <label class="layui-form-label">每月几号</label>
                <div class="layui-input-inline">
                    <select name="month" lay-filter="month" id="month_info">
                        <option value="">请选择</option>
                        @for ($i = 1; $i <= 31; $i++)
                            <option value="{{$i}}">{{$i}}号</option>
                        @endfor
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">推送时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="month_time" id="monthss"
                            placeholder="推送时间"
                           autocomplete="off" class="layui-input">
                </div>

            </div>

        </div>


        <div class="layui-form-item" id="is_times" >
            <label class="layui-form-label">推送时间</label>
            <div class="layui-input-inline">
                <input type="text" name="day_time" id="day_times"
                        placeholder="请选择推送时间"
                       autocomplete="off" class="layui-input" >
            </div>
            {{--            <div class="layui-form-mid layui-word-aux">【可领取区间】</div>--}}
        </div>



        <div class="layui-form-item">
            <label class="layui-form-label">取消推送</label>
            <div class="layui-input-block">
                <input type="radio" name="status" value="0" title="否" {{ (@$model->status !=1) ? 'checked' : '' }}>
                <input type="radio" name="status" value="1" title="是" {{ (@$model->status ==1) ? 'checked' : '' }}>

            </div>
        </div>

        <div class="layui-form-item" id="content">
            <label class="layui-form-label">图文内容</label>
            <div id="test-editormd">
                <textarea name="test-editormd" style="display:none;">{{@$model->content}}</textarea>
            </div>
            @include('markdown::encode',['editors'=>['test-editormd']])
        </div>
        <div class="layui-form-item">
        </div>



        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
@endsection
<!-- 配置文件 -->

@section('script')

    <script>
        var testEditor = editormd("test-editormd",{
            width :"90%",
            height :640,
            path :"/../vendor/markdown/lib/",
            saveHTMLToTextarea :true
        });
        testEditor.getHTML();// 获取 Textarea 保存的 HTML 源码\
    </script>

    <script>
        var multiple_images2 = [];
        layui.use(['jquery', 'form', 'layer','laydate','upload'], function () {
            $ = layui.jquery;
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var upload = layui.upload;
            //定义layedit
            var commitStatus = true;

            if("{{@$model->category}}"==2){
                $("#content").hide();
                $("#imgss").hide();


            }else{
                $("#content").show();
                $("#imgss").show();
            }

            if("{{@$model->type}}"=='at_date'){
                $("#is_time_hidden").show();
                $("#is_times").hide();
                $("#weeks").hide();
                $("#months").hide();
                $("#time").val("{{@$model->time}}")
            }else if("{{@$model->type}}"=='every_day'){
                $("#is_time_hidden").hide();
                $("#is_times").show();
                $("#weeks").hide();
                $("#months").hide();
                $("#day_times").val("{{@$model->time}}")

            }else if("{{@$model->type}}"=='every_week'){
                $("#is_time_hidden").hide();
                $("#is_times").hide();
                $("#weeks").show();
                $("#months").hide();
                var week_info="{{@$model->time}}"

                $("#week_info").val(week_info.split(":")[0])
                $("#week_times").val(week_info.substr(week_info.indexOf(':')+1))

            }else if("{{@$model->type}}"=='every_month'){
                $("#is_time_hidden").hide();
                $("#is_times").hide();
                $("#weeks").hide();
                $("#months").show();

                var month_info="{{@$model->time}}"
                $("#month_info").val(month_info.split(":")[0])
                $("#monthss").val(month_info.substr(month_info.indexOf(':')+1))
            }else{
                $("#is_time_hidden").hide();
                $("#is_times").hide();
                $("#weeks").hide();
                $("#months").hide();
            }


            var time_s='';
            var week_select='';
            laydate.render({
                elem: '#time'
                ,type: 'datetime',
            });

            laydate.render({
                elem: '#day_times'
                ,type: 'time'
                ,format: 'HH:mm'
            });

            laydate.render({
                elem: '#week_times'
                ,type: 'time'
                ,format: 'HH:mm'
            });
            laydate.render({
                elem: '#monthss'
                ,type: 'time'
                ,format: 'HH:mm'
            });

            form.val('add-form', {
                "type": "{{@$model->type}}", // "name": "value"
                "category": "{{@$model->category}}" // "name": "value"
            });

            form.on('select(category)', function (data) {

               if(data.value==1) {
                   $("#content").show();
                   $("#imgss").show();

               }else{
                   $("#content").hide();
                   $("#imgss").hide();
               }
            })

            upload.render({
                elem: '.upload',
                url: '{{url('admin/api/material/upload')}}',
                multiple: true,
                data : {'_token' : '{{ csrf_token() }}','last_img':$("#form_image").val()},
                done: function(res){
                    //如果上传成功
                    if (res.code == 0) {
                        //追加图片成功追加文件名至图片容器
                        layer.msg('上传成功', {icon: 6});
                        var id = this.item[0].id;
                        $("#form_" + id).attr('value',res.data.url);
                        $(".img-" + id).attr('src',res.data.url);
                    }
                    else {
                        layer.alert(res.msg);
                    }
                }
            });


            // form.on('select(week)', function (data) {
            //     week_select=data.value;
            // })

            //获取选择的时间
            form.on('select(type)', function (data) {
                if(data.value=='at_date'){
                    $("#is_time_hidden").show();
                    $("#is_times").hide();
                    $("#weeks").hide();
                    $("#months").hide();
                }else if(data.value=='every_day'){
                    $("#is_time_hidden").hide();
                    $("#is_times").show();
                    $("#weeks").hide();
                    $("#months").hide();
                }else if(data.value=='every_week'){
                    $("#is_time_hidden").hide();
                    $("#is_times").hide();
                    $("#weeks").show();
                    $("#months").hide();

                }else if(data.value=="every_month"){
                    $("#is_time_hidden").hide();
                    $("#is_times").hide();
                    $("#weeks").hide();
                    $("#months").show();

                }else{
                    $("#is_time_hidden").hide();
                    $("#is_times").hide();
                    $("#weeks").hide();
                    $("#months").hide();
                }

            });

            form.on('submit(formSubmit)', function (data) {
                if (commitStatus) {
                    var index = parent.layer.getFrameIndex(window.name);
                    commitStatus = false;

                    var submitUrl = data.field.id ? '{{ url("admin/api/material/create-api") }}' : '{{ url("admin/api/material/create-api") }}';
                    var postData = data.field;

                    $.ajax({
                        headers: {'X-CSRF-TOKEN': "{{ csrf_token() }}"},
                        url: submitUrl,
                        method: "POST",
                        dataType: "json",
                        data: postData,
                        success: function (obj) {
                            commitStatus = true;
                            if (obj.error === 0) {
                                layer.msg('保存成功', {icon: 6});
                                parent.layui.table.reload('data-table'); //重载表格
                                parent.layer.close(index);
                            } else {
                                layer.msg(obj.msg, {icon: 5});
                            }
                        },
                        error: function (e) {
                            layer.msg('服务器错误', {icon: 5});
                        }
                    });
                }
                return false;
            });


            $('.layui-btns .layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
        });

        function AgentSelectedCallback(s, obj) {
            if (s == 1) {
                $("#agent_id").val(obj.id);
                $("#agent_name").val(obj.name);
                layer.closeAll();
            }
        }

        function delMultipleImgs2(this_img){
            console.log(this_img);
            //获取下标
            var subscript=$("#div-slide_show2 img").index(this_img);

            //删除图片
            $.ajax({
                headers: {'X-CSRF-TOKEN': "{{ csrf_token() }}"},
                url:'{{url('admin/api/material/DelUpload')}}',
                dataType:"json",
                type:"post",
                data:{
                    src:multiple_images2[subscript]
                },
                success:function (res){
                    if(res.error==0){
                        //删除图片
                        this_img.remove();
                        //删除数组
                        multiple_images2.splice(subscript, 1);
                        //重新排序
                        multiple_images2.sort();
                        $('.multiple_show_img2').val(multiple_images2);
                        return ;
                    }
                }
            })
        return;
        }

    </script>
@endsection
